<template>
    <el-row v-loading="loading" element-loading-text="拼命加载中" class="tg-row-body">
        <el-col class="warp-breadcrum" style="background-color: #FFFFFF">
            <div style="margin-top: 10px;line-height: 20px">
                <el-radio-group @change="reloadData()" v-model="filters.oprType" style="margin-bottom: 4px;margin-right: 10px">
                    <el-radio-button size="medium" label="-1">所有</el-radio-button>
                    <el-radio-button size="medium" label="0">支出</el-radio-button>
                    <el-radio-button size="medium" label="1">冲正</el-radio-button>
                </el-radio-group>
                <el-select @change="reloadData()" v-model="filters.sourceType" placeholder="充值来源" style="float: right;width: 250px;margin-right: 20px">
                    <el-option
                            v-for="item in sourceTypeOptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                            :disabled="item.disabled">
                    </el-option>
                </el-select>
                <el-date-picker
                        @change="reloadData()"
                        style="float: right;width: 350px;margin-right: 20px"
                        v-model="filters.scopeDate"
                        value-format="yyyy-MM-dd"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期">
                </el-date-picker>
            </div>
            <div style="background-color: #FFFFFF;margin: 0px 20px 0px 0px">
                <el-table :stripe="true" :data="domainList" style="width: 100%;min-height: 200px;">
                    <el-table-column
                            fixed
                            prop="oprTypeName"
                            label="充值类型">
                    </el-table-column>
                    <el-table-column
                            prop="amount"
                            label="充值金额">
                    </el-table-column>
                    <el-table-column
                            prop="sourceTypeName"
                            label="充值来源">
                    </el-table-column>
                    <el-table-column
                            prop="dateCreated"
                            label="充值时间">
                    </el-table-column>
                    <el-table-column
                            prop="oprUserName"
                            label="操作工号">
                    </el-table-column>
                </el-table>
                <el-pagination
                        slot="page"
                        :current-page="page.currentPage"
                        :page-sizes="[10, 20, 50, 100]"
                        :page-size="10"
                        :total="page.totalCount"
                        layout="total, sizes, prev, pager, next, jumper"
                        style="float: right;padding: 10px 20px 10px 0px"
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                />
            </div>
        </el-col>
    </el-row>
</template>
<script>
  import tgForm from '@/components/base/TG_FORM'
  export default {
    name: 'PayoutLog',
    components: { tgForm },
    extends: tgForm,
    props: {
      accountId: {
        type: String,
        required: true
      }
    },
    data() {
      return {
        filters: {
          oprType: -1,
          sourceType: -1,
          scopeDate: '',
          model: 'balancePayout'
        },
        loading: false,
        sourceTypeOptions: [{
          value: -1,
          label: '所有'
        }, {
          value: 0,
          label: '法律催收支出'
        }, {
          value: 1,
          label: '电子签约支出'
        }]
      }
    },
    methods: {
      reloadData() {
        if(this.filters.scopeDate){
          this.filters.beginDate = this.filters.scopeDate[0]
          this.filters.endDate = this.filters.scopeDate[1]
        }
        this.handleSearch()
      }
    },
    created() {
      console.error(this.accountId)
      this.filters.accountId = this.accountId
    }
  }
</script>

<style scoped>

</style>
